跨來源資源共用（CORS）
HTTP访问控制（CORS）

跨來源資源共用（Cross-Origin Resource Sharing (CORS)）是一種使用額外 HTTP 標頭令目前瀏覽網站的使用者代理取得存取其他來源（網域）伺服器特定資源權限的機制。當使用者代理請求一個不是目前文件來源——例如來自於不同網域（domain）、通訊協定（protocol）或通訊埠（port）的資源時，會建立一個跨來源 HTTP 請求（cross-origin HTTP request）。

它允许浏览器向跨源服务器，发出XMLHttpRequest请求，从而克服了AJAX只能同源使用的限制。

1. Access-Control-Allow-Origin

Access-Control-Allow-Origin

Access-Control-Allow-Origin 响应头指定了该响应的资源是否被允许与给定的origin共享。

如需允许所有资源都可以访问您的资源，设置：

Access-Control-Allow-Origin: *

如需允许https://developer.mozilla.org访问您的资源，设置：

Access-Control-Allow-Origin: https://developer.mozilla.org

2. 简单请求（simple request）和非简单请求（not-so-simple request）

1、简单的COR请求，它可以直接向外域资源发起请求。它必须仅仅包含简单的方法和头。

2、如果COR包含复杂的方法和头，它需要发出预检验（Preflight）请求，它先向资源服务器发出一个OPTIONS方法、包含“Origin”头的请求。该回复可以控制COR请求的方法，HTTP头以及验证等信息。只有该请求获得允许以后，才会发起真实的外域请求。

只要同时满足以下两大条件，就属于简单请求。

1
2
3
4
5
6
7
8
9
10
11
（1) 请求方法是以下三种方法之一：
HEAD
GET
POST

（2）HTTP的头信息不超出以下几种字段：
Accept
Accept-Language
Content-Language
Last-Event-ID
Content-Type：只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain

3. 详细使用

跨域资源共享 CORS 详解

服务器端示例

1
2
3
4
5
6
require("http").createServer(function(req,res){
  //报头添加Access-Control-Allow-Origin标签，值为特定的URL或“*”
  //“*”表示允许所有域访问当前域
  res.setHeader("Access-Control-Allow-Origin","*");  
  res.end("OK");
}).listen(1234);

客户端示例

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>CORS</title>
    <script src="jq.js"></script>
</head>
<body>
<div>catching data...</div>
<script>
    $.ajax({
        url:"http://127.0.0.1:1234/",
        success:function(data){
            $("div").text(data)
        }
    })
</script>
</body>
</html>

CORS默认只支持GET/POST这两种http请求类型，如果要开启PUT/DELETE之类的方式，需要在服务端在添加一个”Access-Control-Allow-Methods”报头标签：

1
2
3
4
5
6
7
8
require("http").createServer(function(req,res){
  res.setHeader("Access-Control-Allow-Origin","http://127.0.0.1");
  res.setHeader(
    "Access-Control-Allow-Methods",
    "PUT, GET, POST, DELETE, HEAD, PATCH"
  );
  res.end(req.method+" "+req.url);
}).listen(1234);